/*

the width and height of content decided by the format of pdf

'a0': [2383.94, 3370.39], 'a1': [1683.78, 2383.94],
'a2': [1190.55, 1683.78], 'a3': [841.89, 1190.55],
'a4': [595.28, 841.89], 'a5': [419.53, 595.28],
'a6': [297.64, 419.53], 'a7': [209.76, 297.64],
'a8': [147.40, 209.76], 'a9': [104.88, 147.40],
'a10': [73.70, 104.88], 'b0': [2834.65, 4008.19],
'b1': [2004.09, 2834.65], 'b2': [1417.32, 2004.09],
'b3': [1000.63, 1417.32], 'b4': [708.66, 1000.63],
'b5': [498.90, 708.66], 'b6': [354.33, 498.90],
'b7': [249.45, 354.33], 'b8': [175.75, 249.45],
'b9': [124.72, 175.75], 'b10': [87.87, 124.72],
'c0': [2599.37, 3676.54], 'c1': [1836.85, 2599.37],
'c2': [1298.27, 1836.85], 'c3': [918.43, 1298.27],
'c4': [649.13, 918.43], 'c5': [459.21, 649.13],
'c6': [323.15, 459.21], 'c7': [229.61, 323.15],
'c8': [161.57, 229.61], 'c9': [113.39, 161.57],
'c10': [79.37, 113.39], 'dl': [311.81, 623.62],
'letter': [612, 792],
'government-letter': [576, 756],
'legal': [612, 1008],
'junior-legal': [576, 360],
'ledger': [1224, 792],
'tabloid': [792, 1224],
'credit-card': [153, 243]
*/

body{
    margin: 0px;
    font-family: "Microsoft YaHei", sans-serif;
}

.container{
    display: flex;
    justify-content: center;
    flex-flow: row wrap;

}

.tools{
    position: fixed;
    right: 16px;
    top: 16px;
    text-align: center;
}

.tools button{
    padding: 8px;
    border: 1px #aaa solid;
    border-radius: 4px;
    outline: none;
    font-size: 16px;
    transition: background-color 0.3s;
}

.tools button:hover{
    background-color: orange;
}

.tools button:active{
    background-color: #FF8800;
}

#content{
    display: flex;
    flex-flow: row nowrap;
    flex-direction: column;
    width: 794px;
    height: 1123px;
}

.content-banner{
    color: white;
    display: flex;
    align-items: center;
    width: 100%;
    min-height: 200px;
    background-repeat: no-repeat;
    background-size: cover;
}

.content-banner-logo{
    margin: 18px;
    width: 120px;
    height: 120px;
    border-radius: 60px;
}

.content-main{
    flex: 1;
    text-align: left
}